require('./sports-data.less')
require('../../assets/fonts/iconfont.css')
require('../../assets/css/index.less')
import * as echarts from 'echarts';
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 绘制图表
myChart.setOption({
  title: {
    text: '近七天运动时长'
  },
  tooltip: {},
  xAxis: {
    data: ['11-5', '11-6', '11-7', '11-8', '11-9', '11-10','11-11']
  },
  yAxis: {},
  series: [
    {
      name: '销量',
      type: 'bar',
      data: [5, 20, 36, 30, 40, 60,140]
    }
  ]
});

 //渲染饼图
 function renderPie() {
    //1 创建实例
    const myChart = echarts.init(document.querySelector('#pie'))

    //2 配置项
    let option = {
      title: {
        text: '运动分类',
        left: 15,
        top: 15,
      },
      tooltip: {
        trigger: 'item',
      },
      legend: {
        orient: 'vertical',
        left: 'left',
        top: 'middle',
      },
      series: [
        {
          name: 'Access From',
          type: 'pie',
          radius: '50%',
          data: [
            {
              value: 40,
              name: '训练',
              label: {
                // show: false,
                position: 'inside',
                color: '#fff',
                formatter: '{c}%',
              },
              itemStyle: {
                color: '#58bb92',
              },
            },
            {
              value: 25,
              name: '跑步',
              label: {
                position: 'inside',
                color: '#fff',
                formatter: '{c}%',
              },
              itemStyle: {
                color: '#736171',
              },
            },
            {
              value: 35,
              name: '骑行',
              label: {
                position: 'inside',
                color: '#fff',
                formatter: '{c}%',
              },
              itemStyle: {
                color: '#ee5c43',
              },
            },
          ],
          emphasis: {
            itemStyle: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)',
            },
          },
        },
      ],
    }

    //3 导入配置
    myChart.setOption(option)
  }

  renderPie()

